//---------------------------------------
// XMLDOM Cross Browser
function createXMLDOM() 
{
  if (window.Object){
	  var arrVersions= ["MSXML2.DOMDocument.5.0","MSXML2.DOMDocument.4.0",
		   "MSXML2.DOMDocument.3.0","MSXML2.DOMDocument", "Microsoft.XmlDoc"]; 
		   for (var i=0; i < arrVersions.length; i++)
		   {
				try
				{
				var xmlDoc = new ActiveXObject(arrVersions[i]);
				return xmlDoc;             
				} 
				catch (oError)
				{
					//忽略
				}
	  		}            
	} else if ( document.implementation && document.implementation.createDocument )
	{
		var xmlDoc = new XMLHttpRequest();
		return xmlDoc;
	} else {
		alert ("系統沒有安裝MSXML");
	}
}
function createXMLHTTP() 
{
  var arrVersions= ["MSXML2.XMLHttp.5.0","MSXML2.XMLHttp.4.0",
       "MSXML2.XMLHttp.3.0","MSXML2.XMLHttp", "Microsoft.XMLHttp"];
	   
  for (var i=0; i < arrVersions.length; i++) 
  {
    try 
    {
      var request = new ActiveXObject(arrVersions[i]);
      return request;             
    } 
    catch (exception)
    {
       //忽略
    }
  }           
  alert ("系統沒有安裝MSXML");
}
//---------------------------------------

function getArgs(){
var query = location.search.substring(1);
var pairs = query.split('=');
return pairs[1];
}

var gLatLngArray = new Array();
var gLatLngArrayMod = new Array();
var gMarkerArray = new Array();
function initial()
{
	//alert('');
	initialXML2Makers();
	//var arg = getArgs();
	return;
}
function initialXML2Makers()
{
	var xmlDoc = createXMLDOM();	
	xmlDoc.async = false;
	//var url = 'output/' + '<?php echo $_GET['No']; ?>';
	var args= getArgs();
	var url = 'output/' + args;
	alert( url );
	xmlDoc.load(url);
	var trkptArray = xmlDoc.getElementsByTagName('trkpt');
	//alert ( trkptArray.length );
	
	
	
	//Get gLatLng from XML
	//Show gLatLng to table
	var counter = 0;
	for ( var i=0; i < 2000; i=i+200 )
	{
		var lat = trkptArray[i].getAttribute('lat');
		var lon = trkptArray[i].getAttribute('lon');
		gLatLngArray[counter] = new GLatLng( lat,lon );
		var html = '這是第' + counter + '點</br>緯度' + lat + '；經度' + lon;
		gMarkerArray[counter] = createMarker( gLatLngArray[counter], counter, html );
		
		//DOM 操作部分
		var table = document.getElementById('displayData-table');
		var ol = document.createElement('ol');
		ol.className = 'displayData-table';
		table.appendChild(ol);
		var li = document.createElement('li');
		li.className = 'displayData-table-li';
		ol.appendChild(li);
		
		var span1 = document.createElement('span');
		span1.className = 'displayData-table-header';
		span1.appendChild(document.createTextNode(counter));
		var span2 = document.createElement('span');
		span2.className = 'displayData-table-inner';
		span2.appendChild(document.createTextNode('緯' + lat + '；經' + lon));
		span2.onmouseover = function(){this.style.color='#993300';} 
		span2.onmouseout = function(){this.style.color='#000000';} 
		
		li.appendChild(span1);
		li.appendChild(span2);
		//end DOM 操作部分
		
		counter++;
	}

	
	/*
	for ( var j=0; j < gLatLngArray.length; j++ )
	{
			
			var num = document.getElementById("displayData-table").rows.length;
			var gTr = document.getElementById("displayData-table").insertRow(num);
			gTr.className = 'displayData-table-row';
			var gTd1 = gTr.insertCell(gTr.cells.length);
			gTd1.className = 'displayData-table-header';
			gTd1.innerHTML=j;
			var gTd2 = gTr.insertCell(gTr.cells.length);
			gTd2.innerHTML='緯度' + lat + '經度' + lon;	
			gTd2.className = 'displayData-table-inner';	
			
	}
	*/
	
	//Write gLatLng to gMarker
	if ( GBrowserIsCompatible() )
	{
	GMap = new GMap2 ( document.getElementById('displayMap') );
	GMap.setCenter( gLatLngArray[0], 17 );
	GMap.addControl ( new GSmallMapControl() );
	GMap.addControl ( new GMapTypeControl() );
	 
	//使用GMarkerManager的方法一次新增所有的marker
	var GMM = new GMarkerManager(GMap);
	GMM.addMarkers(gMarkerArray,0);
	GMM.refresh();
	redrawPolyline(gLatLngArray, GMap);
	}
	for ( var temp=0; temp<gLatLngArray.length; temp++){
		gLatLngArrayMod[temp] = gLatLngArray[temp];	
	}
}
function redrawPolyline(gLatLngArray, GMap)
{
	var polyline = new GPolyline(gLatLngArray, "#ff0000", 10);
	GMap.addOverlay(polyline);
}
function createMarker( point, counter, html )
{
	var marker = new GMarker(point, {
		draggable: true
	} );
	marker.enableDragging();
	
	GEvent.addListener( marker, "drag", function()
		{
			document.getElementById('mouseGLatLng').value = marker.getLatLng().toUrlValue();
			marker.closeInfoWindow();
		}
	);
	GEvent.addListener( marker, "dragend", function()
		{
			gLatLngArrayMod[counter] = marker.getLatLng();
			redrawPolyline(gLatLngArrayMod, GMap);
			//alert(counter);
		}
	);
	GEvent.addListener( marker, "drag", function()
		{
			document.getElementById('mouseGLatLng').value = marker.getLatLng().toUrlValue();
			marker.closeInfoWindow();
		}
	);
	
	GEvent.addListener( marker, "click", function()
		{
			document.getElementById('mouseGLatLng').value = marker.getLatLng().toUrlValue();
			marker.openInfoWindowHtml(html);
		}
	);
	return marker;
}
function save(){
	var change = new Array;
	var changeIndex = new Array();
	var changeInt = 0;
	
	var parameter = "<gpx>";
	for ( var temp=0; temp<gLatLngArray.length; temp++){
		if (gLatLngArrayMod[temp] != gLatLngArray[temp]){
			change[changeInt] = gLatLngArrayMod[temp];
			//changeIndex[changeInt] = temp;
			parameter += addXML(parameter,temp);
			changeInt++;
		}
	}
	parameter += "</gpx>";
	alert('將有'+change.length+'軌跡點將被改變');
	/*
	var request = createXMLHTTP();
	request.open('POST', 'php/newXML.php', false);
	request.setRequestHeader('Content-Type', 'text/xml');
	request.send(parameter);
	//alert ( request.status + '\n' + request.statusText + '\n' + request.responseText);
	if ( request.status == 200 ){
		alert('儲存成功!');	
		//displayXMLDoc(status);
	}
	*/
	alert(parameter);
	
}
function addXML(parameter,temp){
	parameter += "<trkpt lat='" + gLatLngArrayMod[temp].lat() + "' lon='" + gLatLngArrayMod[temp].lon() + "' num='" + temp + "'>";
	//parameter += "<time>2009-07-30T05:27:56Z</time>"
  	//parameter += "</trkpt>";
	//parameter += gLatLngArrayMod[temp].lat() + 'aaa';

	return parameter;
}
/*
function unlinkXML()
{
	var request = createXMLHTTP();
	request.open('POST', 'php/unlinkXML.php', false);
	request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
	var parameter = "url=output/2009-12-04-10-07-07";
	request.send(parameter);

	if ( request.status == 200 ){
		//displayXMLDoc(status);
		alert('刪除舊檔' + request.responseText + '完畢');
	}

}
function newXML(serial, status)
{
	//alert ( '要新增的序號為' + serial + '號' );
	var rootNode = loadXMLDoc(status);
	var request = createXMLHTTP();
	
	request.open('POST', 'php/newXML.php', false);
	request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
	var parameter = "status=" + status + "&serial=" + encodeURI( document.getElementById('serial').value ) + "&dateb=" + encodeURI( document.getElementById('dateb').value ) + "&datee=" + encodeURI( document.getElementById('datee').value ) +  "&title=" + encodeURI( document.getElementById('title').value ) + "&text=" + encodeURI( document.getElementById('text').value );
	request.send(parameter);
	//alert ( request.status + '\n' + request.statusText + '\n' + request.responseText);
	if ( request.status == 200 ){
		//displayXMLDoc(status);
		
	}
}
*/